<template name="serviceAdd">
<view class="bgzd">
	<view class="form">
		<view class="form_top">
			<text>添加服务类目</text>
			<image @click="close" src="/static/img/none_close.png"></image>
		</view>
		<view class="page_input">
			<view class="weui-cells__title width20">上级类目:</view>
			<view class="uni-list width60">
				<view class="uni-list-cell">
					<view class="uni-list-cell-db">
						<picker @change="bindNameIndex" :value="NameIndex" :range="cate" 
						range-key="name">
							<view class="uni-input weui-input">{{cate[NameIndex]['name']}}</view>
						</picker>
					</view>
				</view>
			</view>
		</view>
		<view class="page_input" style="padding-top:20rpx;margin-top:20rpx;">
		    <view class="weui-cells__title width20" style="font-size:16px;">类目名称:</view>
		    <view class="width60" style="margin-top:20rpx;">
		        <view class="weui-cell weui-cell_input">
					<input class="weui-input" type="text" v-model="name"
					placeholder-class="placeholderClass" placeholder="请输入类目名称"/>
				</view>
		    </view>
		</view>
		<view class="form_footer">
			<button v-if="addTrue" @click="addService" class="strue">添加</button>
			<button v-else class="sfalse">添加</button>
		</view>
	</view>
</view>
</template>
<script>
import request from '@/util/request.js'
export default {
	name: "serviceAdd",
	//属性
	props:[],
	data() {
		return {
			addRoleTrue:true,
			money:'',
			cate:[
					{'id':0,'name':'一级分类'}
			    ],
			NameIndex:0,
			name:'',
			addTrue:true,
			pid:0
		}
	},
	//组件生命周期
	created:function(e){
		this.getCate()
	},
	methods:{
		getCate:function(){
			var data = {
			  id:uni.getStorageSync('oa_id')
			}
			var that = this
			request({
				url: 'oa/service/getParentService',
				method: 'get',
				data:data,
				success: (res) => {
					if(res.data.code == 1){
						var cate = that.cate
						var arr = res.data.data
						that.cate = cate.concat(arr)
					}
				},
			})
		},
		close:function(){
			this.$emit('func',{'type':0,'model':'serviceAddShow'})
		},
		addService:function(){
			if(!this.name){
				uni.showToast({
					title: '请填写服务类目!!!',
					icon: "none", 
					position:'bottom',
				});
				return;
			}
			this.addTrue = false
			var data = {
				'pid':this.pid,
				'name':this.name,
				'oa_id':uni.getStorageSync('oa_id')
			}
			request({
				url: 'oa/service/add',
				method: 'post',
				data:data,
				success: (res) => {
					if(res.data.code == 1){
						uni.showToast({
							title: '添加成功!!!',
							icon: "none", 
							position:'bottom',
						});
						that.$emit('func',{'type':1,'model':'serviceAddShow'})
					}
				},
			})
			console.log(data)
		},
		bindNameIndex:function(e){
			this.NameIndex = e.detail.value
			this.pid = this.cate[e.detail.value]['id']
			console.log(this.pid)
		}
	},
}
</script>
<style>
.bgzd{
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.4);
	z-index:999;
}
.form{
    padding-top:20rpx;
    padding-left:2%;
    width:100%;
    height:35%;
    bottom:0;
    padding-bottom: 20rpx;
    background:#d9d9d9;
    position: fixed;
    z-index:9999;
}
.form_top{
    font-weight:bold;
    font-size:20px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width:95%;
}
.form_top image{
    width:35rpx;height:35rpx;
    margin-right: 20rpx;
}
.page_input{
	width:100%;
	justify-content: flex-start;
	align-items: center;
    height:40px;
	display: flex;
	padding:10rpx 0 5rpx 15rpx;
	border-bottom: 1rpx solid #c0c0c0;
}
.width20{
	width:20%;
	font-size:16px;
}
.width60{
	width:70%;
}
.form_footer{
    width:95%;
    margin-top:60rpx;
}
.strue{
	width:100%;
	height:80rpx;
	line-height:80rpx;
	background:#ff861a;
	color:#fff;
}
.sfalse{
	width:100%;
	height:80rpx;
	line-height:80rpx;
	background:#8c8c8c;
	color:#fff;}
</style>